import { Point } from "./typings";


export const getTPoint = (p1 : Point, p2 : Point, t: number) : Point => {
    return {
        x:(1-t) * p1.x + t * p2.x,
        y:(1-t) * p1.y + t * p2.y,
    };
};

//求三阶贝塞尔曲线中间控制点
export const calculateBezierControlPos = (beginPos: Point, endPos : Point) : any => {

    let centerPos   : Point = {x:0, y:0};
    let controlPos1 : Point = {x:0, y:0};
    let controlPos2 : Point = {x:0, y:0};
    
    //计算中心点
    //M_x = \frac{x_0 + x_3}{2}, \quad M_y = \frac{y_0 + y_3}{2}
    centerPos.x = (beginPos.x + endPos.x)/2;
    centerPos.y = (beginPos.y + endPos.y)/2;

    //计算控制点P1
    //P_{1x} = \frac{x_0 + M_x}{2}, \quad P_{1y} = \frac{y_0 + M_y}{2}
    controlPos1.x = (beginPos.x + centerPos.x)/2;
    controlPos1.y = (beginPos.y + centerPos.y)/2;
     
    //计算控制点P2
    //P_{2x} = \frac{x_3 + M_x}{2}, \quad P_{2y} = \frac{y_3 + M_y}{2}
    controlPos2.x = (endPos.x + centerPos.x)/2;
    controlPos2.y = (endPos.y + centerPos.y)/2;

    return {controlPos1, controlPos2};

}


interface Point {
    x: number;
    y: number;
  }
  
  function bezierCurve(P: Point[], t: number): Point {
    if (P.length !== 4) {
      throw new Error("P 需要包含四个点");
    }
  
    let points: Point[] = [...P];
  
    while (points.length > 1) {
      let newPoints: Point[] = [];
      for (let i = 0; i < points.length - 1; i++) {
        const p0 = points[i];
        const p1 = points[i + 1];
  
        // 计算插值点
        const newPoint: Point = {
          x: (1 - t) * p0.x + t * p1.x,
          y: (1 - t) * p0.y + t * p1.y,
        };
        newPoints.push(newPoint);
      }
      points = newPoints;
    }
  
    return points[0];
  }
  
  // 示例：定义四个控制点
//   const P: Point[] = [
//     { x: 1, y: 1 },
//     { x: 2, y: 2 },
//     { x: 3, y: 3 },
//     { x: 4, y: 4 },
//   ];
  
  // 计算 t = 0.5 时的曲线点
//   let t = 0.5;
//   let curvePoint = bezierCurve(P, t);
//   console.log(`当 t = ${t} 时，曲线上的点是:`, curvePoint);
  
//   // 计算 t = 0.75 时的曲线点
//   t = 0.75;
//   curvePoint = bezierCurve(P, t);
//   console.log(`当 t = ${t} 时，曲线上的点是:`, curvePoint);



// import { Point } from "../typings";
// import { getTPoint } from "./bezierUtils";

// class DrawHelper {
//   protected _ctx: CanvasRenderingContext2D | undefined;

//   constructor(ctx?: CanvasRenderingContext2D) {
//     this._ctx = ctx;
//   }

//   public get ctx(): CanvasRenderingContext2D | undefined {
//     return this._ctx;
//   }
//   public set ctx(ctx: CanvasRenderingContext2D | undefined) {
//     this._ctx = ctx;
//   }

//   public clear(): void {
//     if (!this._ctx) return;
//     this._ctx.clearRect(0, 0, this._ctx.canvas.width, this._ctx.canvas.height);
//   }

//   public drawRect(x: number, y: number, w: number, h: number): void {
//     if (!this._ctx) return;
//     this._ctx.strokeRect(x, y, w, h);
//   }

//   public drawPoint({ x, y }: Point, color?: string): void {
//     if (!this._ctx) return;
//     this._ctx.beginPath();
//     this._ctx.moveTo(x, y);
//     this._ctx.arc(x, y, 5, 0, Math.PI * 2);
//     this._ctx.fillStyle = color || "#666";
//     this._ctx.fill();
//   }

//   public drawPaths(points: Point[], color?: string): void {
//     if (!this._ctx) return;
//     this._ctx.lineWidth = 2;
//     this._ctx.strokeStyle = color || "red";
//     this._ctx.beginPath();
//     points.forEach(({ x, y }, index) => {
//       if (index === 0) {
//         this._ctx?.moveTo(x, y);
//       } else {
//         this._ctx?.lineTo(x, y);
//       }
//     });
//     this._ctx.stroke();
//   }

//105433 -66300

//  drawBezier(points: Point[], unitT: number): void {
//     //if (!this._ctx || points.length <= 2) return;
//     let timer: NodeJS.Timer | undefined = undefined;
//     let offset = 0;
//     const Unit_Offset = 0.001;
//     const finalPaths: Point[] = [];

//     const bezier = (pathPoints: Point[]) => {
//       if (pathPoints.length < 2) {
//         finalPaths.push(pathPoints[0]);
//         //this.drawPoint(pathPoints[0], "#458fff");
//         //this.drawPaths(finalPaths);
//         return;
//         }
    
//       //this.drawPaths(pathPoints, "green");

//       const tPoints = [] as Point[];
//       for (let i = 0; i < pathPoints.length - 1; i++) {
//         tPoints.push(
//           getTPoint(pathPoints[i], pathPoints[i + 1], unitT + offset)
//         );
//       }
//       bezier(tPoints);
//     };

//     //timer && clearInterval(timer);
//     // timer = setInterval(() => {
//     //   offset += Unit_Offset;
//     //   window.requestAnimationFrame(() => {
//     //     this.clear();
//     //     bezier(points);
//     //   });

//     //   if (offset >= 1) {0.

//     //     timer && clearInterval(timer);
//     //   }
//     // }, 1);
  
//  }

// export default DrawHelper;